<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页</title>
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/register.css">
    <script src="js/axios.js" defer></script>
    <script src="js/register.js" defer></script>

</head>
<body>
<div class="w">
    <!--  1号 header 与首页中的header有不同的样式 -->
    <div class="header">
        <div class="logo">
            <img src="images/logo.png">
            <span>欢迎注册</span>
        </div>
    </div>
    <!--  2号 注册页主体 -->
    <div class="register-main">
        <h3>
            <span>注册新用户</span>
            .....
            <span class="as">我有账户，去<a href="longin.html">登录</a></span>
        </h3>
        <div class="reg-form-box">
            <form action="#" class="reg-form">
                <ul>
                    <li>
                        <!-- label 为了谁？for属性就写谁的id值 -->
                        <label for="username">用户名</label>
                        <input type="text" name="username" id="username"
                               placeholder="请输入用户名">
                        <span class="input-tips">
<!--                                <img src="images/fail.png" alt="">-->
<!--                                用户名已被占用！-->
                            </span>
                    </li>
                    <li>
                        <!-- label 为了谁？for属性就写谁的id值 -->
                        <label for="phone">手机号</label>
                        <input type="text" name="phone" id="phone"
                               placeholder="请输入手机号">
                        <span class="input-tips">
<!--                                <img src="images/success.png" alt="">-->
                            </span>
                    </li>
                    <li>
                        <!-- label 为了谁？for属性就写谁的id值 -->
                        <label for="password">登录密码</label>
                        <input type="text" name="password" id="password"
                               placeholder="请输入登录密码">
                        <span class="input-tips">
<!--                                <img src="images/success.png" alt="">-->
                            </span>
                    </li>
                    <li>
                        <!-- label 为了谁？for属性就写谁的id值 -->
                        <label for="password2">确认登录密码</label>
                        <input type="text" name="password2" id="password2"
                               placeholder="请确认登录密码">
                        <span class="input-tips">
<!--                                <img src="images/fail.png" alt="">-->
<!--                                两次密码不一致-->
                            </span>
                    </li>
                    <li>
                        <label for="verify">验证码</label>
                        <input type="text" name="verify" id="verify" >
                        <span class="verify-result-tips"></span>
                        <img src="http://101.43.149.52:8080/brand_crud/verifyCode?method=getCode" class="verify-image" id="yanzhengma">
                        <a href="javascript:void(0);" id="kanbuqing">看不清？</a>
                    </li>
                    <li>
                        <p class="agree-checkbox-container">
                            <input type="checkbox" name="agree" id="agree">同意
                            <a href="#">《用户协议》</a>并注册
                        </p>
                    </li>
                </ul>
                <div class="reg-btn-container">
                    <input type="button" value="完成注册" id="registerBtn">
                </div>
            </form>
        </div>
    </div>
    <!--  3号 footer -->
    <div class="footer">
        <div class="links">
            <ul>
                <li><a href="#">关于我们</a></li>
                <li><a href="#">联系我们</a></li>
                <li><a href="#">联系客服</a></li>
                <li><a href="#">商家入驻</a></li>
                <li><a href="#">营销中心</a></li>
                <li><a href="#">友情链接</a></li>
                <li><a href="#">公益社区</a></li>
                <li><a href="#">销售联盟</a></li>
                <li><a href="#">English Site</a></li>
                <li class="last"><a href="#">Contact US</a></li>
            </ul>
        </div>
        <p>Copyright© 2020-2022深圳市云网万店电子商务有限公司版权所有</p>
        <p>地址：江苏省南京市玄武区徐庄软件园苏宁大道1号 邮编：210042</p>
    </div>
</div>
</body>
</html>